css 给div添加滚动并隐藏滚动条,或修改滚动条轨道颜色

2024-06-15 19:39| 来源: 网络整理| 查看: 265

在html中

下面内容会单独滚动

1111111111111111

222222222222222

333333333333333

4444444444444444

1111111111111111

222222222222222

333333333333333

4444444444444444

css部分

div{ font-size: 15px; margin-bottom: 20px; } .content{ height: 300px;v // 必须设定滚动部分的高度 background-color: cadetblue; color: antiquewhite; overflow-x: hidden; /*x轴禁止滚动*/ 　　　　 overflow-y: scroll;/*y轴滚动*/ } .content::-webkit-scrollbar { display: none;/*隐藏滚动条*/ } p{ margin-bottom: 30px; font-size: 17px; color: #333; }

　　或者如果需要修改滚动条样式使用下面样式

div{ font-size: 15px; margin-bottom: 20px; } .content{ height: 300px;v // 必须设定滚动部分的高度 background-color: cadetblue; color: antiquewhite; overflow-x: hidden; /*x轴禁止滚动*/ 　　　　 overflow-y: scroll;/*y轴滚动*/ } .content::-webkit-scrollbar{ //设置滚动条宽高 width:8px; height:8px } .content::-webkit-scrollbar-track{// 滚动条轨道样式 -webhit-box-shadow: inset 0 0 5px transparent; border-radius:0; background:transparent; } .content::-webkit-scrollbar-thumb{//滚动条样式 border-radius:5px; -webkit-box-shadow:inset 0 0 5px #242B56; background:#242B56; } p{ margin-bottom: 30px; font-size: 17px; color: #333; }

【本文地址】

公司简介

联系我们